<!--
 * @Description:
 * @version:
 * @Author: 尹鹏孝
 * @Date: 2023-03-08 10:33:41
 * @LastEditors: 尹鹏孝
 * @LastEditTime: 2023-03-08 14:01:46
-->
<template>
    <div>
        {{ count }}-----{{ nameMe }}
    </div>
</template>
<script>
import {ref,toRef,toRefs,reactive,readonly} from 'vue'
export default{
    props:['title','name'],
    setup(props,context) {
        const count =ref(520);
        console.log(context)
        const {name} = toRefs(props)
      const title = toRef(props, 'title')
       context.expose({ count: 'publicCount' })
        const increment = () => ++count.value

           context.expose({
            increment
            })
        const obj = reactive({count});
       console.log(obj.count===count.value)

       const copy = readonly(count)

        return {
            count,
            nameMe:name,
            copy
        }
    },
    watch:{
        'count':function(val){
            console.log('watch:',val)
            console.log('watch:',this.copy)
        }

    },
    mounted() {
        console.log(this.count)
    },
}
</script>